<script>
export default {
  data() { 
    return{ 
      msg: "HelloWord",
      msa: "tu",
      zonghe:{ 
        msg: "HelloWord",
        msa: "tu",
      },
      zonghe1:{ 
        id: "idtest",
        class: "calsstest",
      }
    }
  }
}
</script>

<template>
<p class="{{ msg }}">测试</p>  
<!-- <p class="{{ msg }}">测试</p> -->

<p v-bind:class="msg">测试</p>
<!-- <p class="HelloWord">测试</p> -->

<p v-bind:class="msg" v-bind:id="msa">id and class</p>
<!-- <p class="HelloWord" id="tu">id and class</p> -->
<p :class="msg" :id="msa">id and class</p>
<!-- <p class="HelloWord" id="tu">id and class</p> -->

<p v-bind="zonghe">对象属性绑定(自定义属性)</p>
<!-- <p msg="HelloWord" msa="tu">对象属性绑定</p> -->

<p v-bind="zonghe1">对象属性绑定（id和class属性）</p>
<!-- <p id="idtest" class="calsstest">对象属性绑定（id和class属性）</p> -->

</template>

<style>

</style>
